<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="author" content="Untree.co">

    <meta name="description" content="">
    <meta name="keywords" content="">
    <link rel="preconnect" href="https://fonts.googleapis.com/">
    <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin="">
    <link href="static/css/css2.css" rel="stylesheet">
    <link rel="stylesheet" href="static/css/bootstrap.min.css">
    <link rel="stylesheet" href="static/css/owl.carousel.min.css">
    <link rel="stylesheet" href="static/css/owl.theme.default.min.css">
    <link rel="stylesheet" href="static/css/jquery.fancybox.min.css">
    <link rel="stylesheet" href="static/css/style.css">
    <link rel="stylesheet" href="static/css/flaticon.css">
    <link rel="stylesheet" href="static/css/aos.css">
    <link rel="stylesheet" href="static/css/style1.css">
    <title>Landing Free HTML Template by Untree.co</title>
</head>

<body data-spy="scroll" data-target=".site-navbar-target" data-offset="100">
    <div class="site-mobile-menu site-navbar-target">
        <div class="site-mobile-menu-header">
            <div class="site-mobile-menu-close">
                <span class="icofont-close js-menu-toggle"></span>
            </div>
        </div>
        <div class="site-mobile-menu-body"></div>
    </div>
    <nav class="site-nav dark js-site-navbar mb-5 site-navbar-target">
        <div class="container">
            <div class="site-navigation">
                <a href="#" class="logo m-0 float-left" style="color: #2e4edf;">Truehope</a>

                <ul class="js-clone-nav d-none mt-1 d-lg-inline-block site-menu float-right">
                    <li class="cta-button-outline"><a href="index.html">回到主页</a></li>
                </ul>
                <a href="#"
                    class="burger ml-auto float-right site-menu-toggle js-menu-toggle d-inline-block dark d-lg-none"
                    data-toggle="collapse" data-target="#main-navbar">
                    <span></span>
                </a>
            </div>
        </div>
    </nav>
    <div class="untree_co-login-register">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-5">
                    <div class="custom-box" data-aos="fade-up" data-aos-delay="0">
                        <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
                        <script>
                            $(document).ready(function () {
                                $('#loginForm').submit(function (e) {
                                    e.preventDefault();

                                    var phone = $('#phoneInput').val();
                                    var password = $('#passwordInput').val();

                                    var userData = {
                                        phone: phone,
                                        password: password
                                    };

                                    $.ajax({
                                        url: 'http://127.0.0.1:8080/user/register',
                                        type: 'POST',
                                        contentType: 'application/json',
                                        data: JSON.stringify(userData),
                                        success: function (response) {
                                            if (response.code == 200) {
                                                localStorage.setItem("username", response.username)
                                                localStorage.setItem("password", password)
                                                localStorage.setItem("verify", response.username)
                                                alert("用户注册成功")
                                                window.location.href = 'home.html'
                                            } else if (response.code == 201) {
                                                alert("用户已存在")
                                            } else {
                                                alert("用户创建失败")
                                            }
                                        },
                                        error: function (xhr, status, error) {
                                            console.error(error);
                                        }
                                    });
                                });
                            });
                        </script>
                        <h4 style="text-align: center;" class="heading">注 册</h4>
                        <br>
                        <form id="loginForm" style="text-align: center;">
                            <input type="text" id="phoneInput" name="phone" required placeholder="请输入手机号"><br><br>

                            <input type="password" id="passwordInput" name="password" required
                                placeholder="请输入密码"><br><br>

                            <button type="submit" class="btn btn-primary">注册</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="static/js/jquery-3.4.1.min.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script src="static/js/jquery-migrate-3.0.1.min.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script src="static/js/popper.min.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script src="static/js/bootstrap.min.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script src="static/js/owl.carousel.min.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script src="static/js/jquery.easing.1.3.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script src="static/js/jquery.animateNumber.min.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script src="static/js/jquery.waypoints.min.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script src="static/js/jquery.fancybox.min.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script src="static/js/aos.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script src="static/js/custom.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script async="" src="static/js/js.js" type="ff78cc5bcbc6755a5150144f-text/javascript"></script>
    <script
        type="ff78cc5bcbc6755a5150144f-text/javascript">window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag("js", new Date()); gtag("config", "UA-166033648-1");</script>
    <script src="static/js/rocket-loader.min.js" data-cf-settings="ff78cc5bcbc6755a5150144f-|49" defer=""></script>
</body>

</html>